<template>
  <van-dialog :show="IsShowDialog" width="270" height="128">
    <div class="dialog-text">{{ text }}</div>
    <template #footer>
      <div class="dialog-footer-slot">
        <div
          class="confrim"
          @click="emit('deleteIsReadMessage', '')"
        >
          确认删除
        </div>
        <div class="footer-solt-cnacel" @click="() => emit('cancel', '')">
          取消
        </div>
      </div>
    </template>
  </van-dialog>
</template>

<script setup lang="ts">
interface PropsType {
  text: string
  IsShowDialog: boolean
}
const emit = defineEmits(['cancel', 'deleteIsReadMessage'])

defineProps<PropsType>()
</script>

<style scoped lang="scss">
.confrim{
  height: 100%;
  line-height: 49px;
  flex: 1;
  font-size: 18px;
  color: #999;
  text-align: center;
}
.footer-solt-cnacel {
  height: 100%;
  line-height: 49px;
  flex: 1;
  text-align: center;
  font-size: 18px;
  color: #00c8be;
  border-left: #999 solid 0.5px;
}
.dialog-footer-slot {
  height: 49px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 1px solid #999;
}
.dialog-text {
  height: 54px;
  text-align: center;
  font-size: 16px;
  padding-top: 25px;
  font-weight: bold;
}
</style>
